<!-- 工资结算详情弹窗 -->
<template>
  <a-form
    ref="form3"
    class="ele-form-detail"
    :model="salarySettlementModalApp.salarySettlement"
    :label-col="{md: {span: 2}, sm: {span: 4}, xs: {span: 6}}"
    :wrapper-col="{md: {span: 22}, sm: {span: 20}, xs: {span: 18}}">
    <a-descriptions :title="salarySettlementModalApp.title" bordered>
      <a-descriptions-item label="标识">
        {{ salarySettlementModalApp.salarySettlement.Eid }}
      </a-descriptions-item>
      <a-descriptions-item label="创建人">
        {{ salarySettlementModalApp.salarySettlement.creatorName }}
      </a-descriptions-item>
      <a-descriptions-item label="名称">
        {{ salarySettlementModalApp.salarySettlement.name }}
      </a-descriptions-item>
      <a-descriptions-item label="员工">
        {{ salarySettlementModalApp.salarySettlement.staffId }}
      </a-descriptions-item>
      <a-descriptions-item label="工资金额">
        {{ salarySettlementModalApp.salarySettlement.amount }}
      </a-descriptions-item>
      <a-descriptions-item label="状态">
        {{ salarySettlementModalApp.salarySettlement.status }}
      </a-descriptions-item>
      <a-descriptions-item label="结算开始日期">
        {{ salarySettlementModalApp.salarySettlement.settleStartDate }}
      </a-descriptions-item>
      <a-descriptions-item label="结算日期">
        {{ salarySettlementModalApp.salarySettlement.settleDate }}
      </a-descriptions-item>
      <a-descriptions-item label="创建人ID">
        {{ salarySettlementModalApp.salarySettlement.creatorId }}
      </a-descriptions-item>
      <a-descriptions-item label="备注">
        {{ salarySettlementModalApp.salarySettlement.remark }}
      </a-descriptions-item>
      <a-descriptions-item label="创建时间">
        {{ salarySettlementModalApp.salarySettlement.createDatetime }}
      </a-descriptions-item>
    </a-descriptions>
  </a-form>
</template>

<script>
import {defineComponent, reactive, onMounted, inject} from "vue";
import {useRoute} from "vue-router"
import {SalarySettlementService} from "@/views/restaurant/staff/salarySettlement/salarySettlementService";

export default defineComponent({
  setup() {
    const route = useRoute();
    let routeId = route.params.id;
    let salarySettlementListApp = inject('salarySettlementListApp', reactive({}));
    const salarySettlementModalApp = reactive({id: null, salarySettlement: {}, display: false});

    onMounted(() => {
      salarySettlementModalApp.salarySettlement = {};
      if (routeId) {
        salarySettlementModalApp.id = routeId;
      } else if (salarySettlementListApp.viewModalShowing) {
        salarySettlementModalApp.id = salarySettlementListApp.currentId;
        salarySettlementModalApp.display = true;
      }
      if (salarySettlementModalApp.id) {
        getInfo(salarySettlementModalApp.id);
      }
    })

    const getInfo = (id) => {
      SalarySettlementService.findSalarySettlement(id).then((res) => {
        salarySettlementModalApp.salarySettlement = res.data;
        salarySettlementModalApp.title = "查看 " + salarySettlementModalApp.salarySettlement.name;
      })
    }

    return {
      salarySettlementModalApp,
      routeId,
      getInfo,
    }
  }
})
</script>

<style scoped>
</style>

